/* eslint-disable no-unused-vars */
/* eslint-disable no-param-reassign */
/* eslint-disable no-unused-expressions */
import Vue from 'vue';
import ElementUI from 'element-ui';
import ProductAddDialogComponent from './product-add.dialog.component.vue';
import 'element-ui/lib/theme-chalk/index.css';

Vue.use(ElementUI);
export const a = 1;
export class ProductAddDialogService {
  static createElement() {
    const element = document.createElement('div');
    document.body.appendChild(element);
    return element;
  }

  constructor(fetcher, store, options = {}) {
    this.fetcher = fetcher;
    this.store = store;
    this.options = {
      type: 'default',
      ...options
    };
  }

  create({ title, query, confirmButtonClickHandler } = {}) {
    title || (title = '添加产品');
    query || (query = {});
    confirmButtonClickHandler ||
      (confirmButtonClickHandler = (_data = {}) => {});
    const App = Vue.extend(ProductAddDialogComponent);
    return (() => {
      // eslint-disable-next-line no-underscore-dangle
      const _this = this;
      return {
        mount() {
          const vm = new App({
            propsData: {
              type: _this.options.type,
              title,
              query,
              visible: true,
              fetcher: _this.fetcher,
              store: _this.store
            }
          });
          const element = ProductAddDialogService.createElement();
          const destroy = () => {
            const elementx = vm.$el;
            if (element.parentNode) {
              element.parentNode.removeChild(elementx);
            }
          };
          vm.$on('destroy', destroy);
          vm.$on('confirm', confirmButtonClickHandler);
          vm.$mount(element);
          return {
            unmount: () => {
              destroy();
              return this;
            }
          };
        }
      };
    })();
  }
}
